<!DOCTYPE html>
<html>

	<head>
		<meta charset="utf-8">
		<meta name="viewport" content="width=device-width, initial-scale=1,maximum-scale=1,user-scalable=no">
		<link rel="stylesheet" type="text/css" href="../css/mui.min.css" />
		<link rel="stylesheet" type="text/css" href="../css/mystyle.css" />
		<style type="text/css">
			body {
				background-color: #EFEFF4;
				font-size: 15px;
			}
			
			input,
			textarea {
				border: none !important;
			}
			
			textarea {
				height: 100px;
				margin-bottom: 0 !important;
				padding-bottom: 0 !important;
			}
			
			.row {
				width: 100%;
				background-color: #fff;
			}
			
			p {
				padding: 10px 15px 0;
			}
			
			input::-webkit-input-placeholder,
			textarea::-webkit-input-placeholder {
				font-size: 14px;
			}
			
			.image-list {
				padding-top: 10px;
				padding-bottom: 5px;
			}
			
			.image-item {
				width: 70px;
				height: 70px;
				background-image: url('../img/iconfont-tianjia.png');
				background-repeat: no-repeat;
				background-position: center;
				background-size: 100% 100%;
				display: inline-block;
				position: relative;
				border-radius: 5px;
				margin-left: 8px;
				border: solid 1px #e8e8e8;
			}
			
			.image-item.space {
				border: none;
			}
			
			.image-item .image-close {
				position: absolute;
				display: inline-block;
				right: -6px;
				top: -6px;
				width: 20px;
				height: 20px;
				text-align: center;
				line-height: 20px;
				border-radius: 12px;
				background-color: #FF5053;
				color: #f3f3f3;
				border: solid 1px #FF5053;
				font-size: 9px;
				font-weight: 200;
				z-index: 1;
			}
			
			.image-item.space .image-close {
				display: none;
			}
			
			.mui-inline {
				vertical-align: bottom;
				font-size: 14px;
				color: #8f8f94;
			}
			
			.stream {
				display: none;
			}
			
			.mui-plus-stream .stream {
				display: block;
			}
			
			#message,
			#upload_box,
			#price_box {
				height: 2.6em;
			}
			
			#message {
				display: none;
			}
			
			#upload_box {
				line-height: 2.6em;
				text-align: center;
				display: none;
				background: #fff;
			}
			
			@-webkit-keyframes spin {
				0% {
					-webkit-transform: rotate(0deg);
				}
				100% {
					-webkit-transform: rotate(360deg);
				}
			}
			
			@keyframes spin {
				0% {
					transform: rotate(0deg);
				}
				100% {
					transform: rotate(360deg);
				}
			}
			
			.icobtn {
				display: none;
				width: 100%;
			}
			
			#upload_progress {
				top: 0;
				position: fixed;
				z-index: 999;
				display: none;
			}
			
			.mui-progressbar-success span {
				background-color: #4cd964;
			}
			
			.word {
				font-size: 16px;
				color: black;
			}
			
			.bigword {
				font-size: 18px;
				color: black;
			}
			
			.labelTitle {
				line-height: 38px;
				color: gray;
			}
			
			.mui-table-view-cell {
				padding: 2px 15px;
			}
		</style>
	</head>

	<body>
		<header class="mui-bar mui-bar-nav">
			<a class="mui-action-back mui-icon mui-icon-left-nav mui-pull-left"></a>
			<h1 id="headtitle" class="mui-title">巡查记录</h1>
		</header>
		<div class="mui-content" style="width:100%;margin:5px auto;">
			<div class="mui-progressbar mui-progressbar-success mui-padding-top-xs" id="upload_progress">
				<span></span>
			</div>
			<ul class="mui-margin-vertical-sm mui-table-view" style="margin: 0rem!important">
				<li class="mui-table-view-cell" style="background-color: #fff;">
					<span class="labelTitle">水表编号&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</span>
					<span id="picSbbh" />
				</li>
			</ul>
			<ul class="mui-margin-vertical-sm mui-table-view" style="margin: 0rem!important">
				<li class="mui-table-view-cell" style="background-color: #fff;">
					<span class="labelTitle">站点名&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</span>
					<span id="" />
				</li>
			</ul>
			<ul class="mui-margin-vertical-sm mui-table-view" style="margin: 0rem!important">
				<li class="mui-table-view-cell" style="background-color: #fff;">
					<span class="labelTitle">取水地址&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</span>
					<span id="picQsdz" />
				</li>
			</ul>

			<ul class="mui-margin-vertical-sm mui-table-view" style="margin: 0rem!important">
				<li class="mui-table-view-cell" style="background-color: #fff;">
					<span class="labelTitle">计量设备&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</span>
					<div class="mui-input-row" style="display: inline;float: right;">
						<div class=" mui-radio mui-pull-left mui-left">
							<label>流量计</label>
							<input name="radio1" value="流量计" type="radio" checked>
						</div>
						<div class="mui-radio mui-pull-left mui-left">
							<label>水表&nbsp;&nbsp;</label>
							<input name="radio1" value="水表" type="radio">
						</div>
					</div>
				</li>
			</ul>

			<ul class="mui-margin-vertical-sm mui-table-view" style="margin: 0rem!important">
				<li class="mui-table-view-cell" style="background-color: #fff;">
					<span class="labelTitle">取电方式&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</span>
					<div class="mui-input-row" style="display: inline;float: right;">
						<div class=" mui-radio mui-pull-left mui-left">
							<label>市电&nbsp;&nbsp;&nbsp;&nbsp;</label>
							<input name="radio2" value="市电" type="radio" checked>
						</div>
						<div class="mui-radio mui-pull-left mui-left">
							<label>电池&nbsp;&nbsp;</label>
							<input name="radio2" value="电池" type="radio">
						</div>
					</div>
				</li>
			</ul>

			<ul class="mui-margin-vertical-sm mui-table-view" style="margin: 0rem!important">
				<li class="mui-table-view-cell" style="background-color: #fff;">
					<span class="labelTitle">现场数据（瞬时）</span>
					<div class="mui-input-row" style="display: inline;float: right;">
						<div class=" mui-pull-left mui-left">
							<div class="mui-numbox" data-numbox-step='1' data-numbox-min='0' data-numbox-max='1000000' style='width:180px'>
								<button class="mui-btn mui-btn-numbox-minus" type="button">-</button>
								<input id='sceneNowValueInput' class="mui-input-numbox" type="number" />
								<button class="mui-btn mui-btn-numbox-plus" type="button">+</button>
							</div>
						</div>
					</div>
				</li>
			</ul>
			<ul class="mui-margin-vertical-sm mui-table-view" style="margin: 0rem!important">
				<li class="mui-table-view-cell" style="background-color: #fff;">
					<span class="labelTitle">现场数据（累计）</span>
					<div class="mui-input-row" style="display: inline;float: right;">
						<div class=" mui-pull-left mui-left">
							<div class="mui-numbox" data-numbox-step='1' data-numbox-min='0' data-numbox-max='1000000' style='width:180px'>
								<button class="mui-btn mui-btn-numbox-minus" type="button">-</button>
								<input id='sceneTotalValueInput' class="mui-input-numbox" type="number" />
								<button class="mui-btn mui-btn-numbox-plus" type="button">+</button>
							</div>
						</div>
					</div>
				</li>
			</ul>
			<ul class="mui-margin-vertical-sm mui-table-view" style="margin: 0rem!important">
				<li class="mui-table-view-cell" style="background-color: #fff;">
					<span class="labelTitle">后台数据（瞬时）&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</span>
					<span id="backNowValueInput" />
				</li>
			</ul>
			<ul class="mui-margin-vertical-sm mui-table-view" style="margin: 0rem!important">
				<li class="mui-table-view-cell" style="background-color: #fff;">
					<span class="labelTitle">后台数据（累计）&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</span>
					<span id="backTotalValueInput" />
				</li>
			</ul>

			<div id="upTypeDiv">
				<div class="mui-margin-vertical-sm" style="margin-bottom:0rem!important">
					<div class="mui-inline mui-padding-horizontal-xs">地表取水情况跟踪</div>
				</div>
				<ul class="mui-margin-vertical-sm mui-table-view" style="margin: 0rem!important">
					<li class="mui-table-view-cell" style="background-color: #fff;">
						<span id="radio3Title" class="labelTitle">流量计通讯输出</span>
						<div class="mui-input-row" style="display: inline;float: right;">
							<div class=" mui-radio mui-pull-left mui-left">
								<label>正常</label>
								<input name="radio3" type="radio" value="正常" class="radioBtn" checked>
							</div>
							<div class="mui-radio mui-pull-left mui-left">
								<label>异常</label>
								<input name="radio3" type="radio" value="异常" class="radioBtn">
							</div>
						</div>
					</li>
					<li id="radio3InputDiv" class="mui-table-view-cell displayNone" style="background-color: #fff;">
						<span class="labelTitle">备注</span>
						<div class="mui-input-row" style="display: inline;float: right;">
							<input type="text" class="mui-input-clear" placeholder="异常情况说明及处理结果（选填）" style="margin-bottom: 0px;" />
						</div>
					</li>
				</ul>

				<ul class="mui-margin-vertical-sm mui-table-view" style="margin: 0rem!important">
					<li class="mui-table-view-cell" style="background-color: #fff;">
						<span id="radio4Title" class="labelTitle">流量计数据核对</span>
						<div class="mui-input-row" style="display: inline;float: right;">
							<div class=" mui-radio mui-pull-left mui-left">
								<label>正常</label>
								<input name="radio4" type="radio" value="正常" class="radioBtn" checked>
							</div>
							<div class="mui-radio mui-pull-left mui-left">
								<label>异常</label>
								<input name="radio4" type="radio" value="异常" class="radioBtn">
							</div>
						</div>
					</li>
					<li id="radio4InputDiv" class="mui-table-view-cell displayNone" style="background-color: #fff;">
						<span class="labelTitle">备注</span>
						<div class="mui-input-row" style="display: inline;float: right;">
							<input type="text" class="mui-input-clear" placeholder="异常情况说明及处理结果（选填）" style="margin-bottom: 0px;" />
						</div>
					</li>
				</ul>

				<ul class="mui-margin-vertical-sm mui-table-view" style="margin: 0rem!important">
					<li class="mui-table-view-cell" style="background-color: #fff;padding-right:0px">
						<span id="radio5Title" class="labelTitle">通讯信号检查</span>
						<div class="mui-input-row" style="display: inline;float: right;">
							<div class=" mui-radio mui-pull-left mui-left">
								<label>正常</label>
								<input name="radio5" type="radio" value="正常" class="radioBtn" checked>
							</div>
							<div class="mui-radio mui-pull-left mui-left">
								<label>未完成</label>
								<input name="radio5" type="radio" value="未完成" class="radioBtn">
							</div>
						</div>
					</li>
					<li id="radio5InputDiv" class="mui-table-view-cell displayNone" style="background-color: #fff;">
						<span class="labelTitle">备注</span>
						<div class="mui-input-row" style="display: inline;float: right;">
							<input type="text" class="mui-input-clear" placeholder="异常情况说明及处理结果（选填）" style="margin-bottom: 0px;" />
						</div>
					</li>
				</ul>
				<ul class="mui-margin-vertical-sm mui-table-view" style="margin: 0rem!important">
					<li class="mui-table-view-cell" style="background-color: #fff;">
						<span id="radio6Title" class="labelTitle">电子元器件及清洁</span>
						<div class="mui-input-row" style="display: inline;float: right;">
							<div class=" mui-radio mui-pull-left mui-left">
								<label>正常</label>
								<input name="radio6" type="radio" value="正常" class="radioBtn" checked>
							</div>
							<div class="mui-radio mui-pull-left mui-left">
								<label>异常</label>
								<input name="radio6" type="radio" value="异常" class="radioBtn">
							</div>
						</div>
					</li>
					<li id="radio6InputDiv" class="mui-table-view-cell displayNone" style="background-color: #fff;">
						<span class="labelTitle">备注</span>
						<div class="mui-input-row" style="display: inline;float: right;">
							<input type="text" class="mui-input-clear" placeholder="异常情况说明及处理结果（选填）" style="margin-bottom: 0px;" />
						</div>
					</li>
				</ul>
				<ul class="mui-margin-vertical-sm mui-table-view" style="margin: 0rem!important">
					<li class="mui-table-view-cell" style="background-color: #fff;padding-right:0px">
						<span id="radio7Title" class="labelTitle">电源、避雷检查</span>
						<div class="mui-input-row" style="display: inline;float: right;">
							<div class=" mui-radio mui-pull-left mui-left">
								<label>正常</label>
								<input name="radio7" type="radio" value="正常" class="radioBtn" checked>
							</div>
							<div class="mui-radio mui-pull-left mui-left">
								<label>未完成</label>
								<input name="radio7" type="radio" value="未完成" class="radioBtn">
							</div>
						</div>
					</li>
					<li id="radio7InputDiv" class="mui-table-view-cell displayNone" style="background-color: #fff;">
						<span class="labelTitle">备注</span>
						<div class="mui-input-row" style="display: inline;float: right;">
							<input type="text" class="mui-input-clear" placeholder="异常情况说明及处理结果（选填）" style="margin-bottom: 0px;" />
						</div>
					</li>
				</ul>
				<ul class="mui-margin-vertical-sm mui-table-view" style="margin: 0rem!important">
					<li class="mui-table-view-cell" style="background-color: #fff;">
						<span id="radio8Title" class="labelTitle">接地测试</span>
						<div class="mui-input-row" style="display: inline;float: right;">
							<div class=" mui-radio mui-pull-left mui-left">
								<label>正常</label>
								<input name="radio8" type="radio" value="正常" class="radioBtn" checked>
							</div>
							<div class="mui-radio mui-pull-left mui-left">
								<label>异常</label>
								<input name="radio8" type="radio" value="异常" class="radioBtn">
							</div>
						</div>
					</li>
					<li id="radio8InputDiv" class="mui-table-view-cell displayNone" style="background-color: #fff;">
						<span class="labelTitle">备注</span>
						<div class="mui-input-row" style="display: inline;float: right;">
							<input type="text" class="mui-input-clear" placeholder="异常情况说明及处理结果（选填）" style="margin-bottom: 0px;" />
						</div>
					</li>
				</ul>

				<ul class="mui-margin-vertical-sm mui-table-view" style="margin: 0rem!important">
					<li class="mui-table-view-cell" style="background-color: #fff;">
						<span id="radio9Title" class="labelTitle">后台数据核对</span>
						<div class="mui-input-row" style="display: inline;float: right;">
							<div class=" mui-radio mui-pull-left mui-left">
								<label>正常</label>
								<input name="radio9" type="radio" value="正常" class="radioBtn" checked>
							</div>
							<div class="mui-radio mui-pull-left mui-left">
								<label>异常</label>
								<input name="radio9" type="radio" value="异常" class="radioBtn">
							</div>
						</div>
					</li>
					<li id="radio9InputDiv" class="mui-table-view-cell displayNone" style="background-color: #fff;">
						<span class="labelTitle">备注</span>
						<div class="mui-input-row" style="display: inline;float: right;">
							<input type="text" class="mui-input-clear" placeholder="异常情况说明及处理结果（选填）" style="margin-bottom: 0px;" />
						</div>
					</li>
				</ul>
				<ul class="mui-margin-vertical-sm mui-table-view" style="margin: 0rem!important">
					<li class="mui-table-view-cell" style="background-color: #fff;">
						<span id="radio10Title" class="labelTitle">PLC程序备份</span>
						<div class="mui-input-row" style="display: inline;float: right;">
							<div class=" mui-radio mui-pull-left mui-left">
								<label>正常</label>
								<input name="radio10" type="radio" value="正常" class="radioBtn" checked>
							</div>
							<div class="mui-radio mui-pull-left mui-left">
								<label>异常</label>
								<input name="radio10" type="radio" value="异常" class="radioBtn">
							</div>
						</div>
					</li>
					<li id="radio10InputDiv" class="mui-table-view-cell displayNone" style="background-color: #fff;">
						<span class="labelTitle">备注</span>
						<div class="mui-input-row" style="display: inline;float: right;">
							<input type="text" class="mui-input-clear" placeholder="异常情况说明及处理结果（选填）" style="margin-bottom: 0px;" />
						</div>
					</li>
				</ul>

			</div>

			<div id="downTypeDiv">
				<div class="mui-margin-vertical-sm" style="margin-bottom:0px!important">
					<div class="mui-inline mui-padding-horizontal-xs">地下取水（回灌井）情况跟踪</div>
				</div>
				<ul class="mui-margin-vertical-sm mui-table-view" style="margin: 0rem!important">
					<li class="mui-table-view-cell" style="background-color: #fff;">
						<span id="radio11Title" class="labelTitle">水表通讯输出检查</span>
						<div class="mui-input-row" style="display: inline;float: right;">
							<div class=" mui-radio mui-pull-left mui-left">
								<label>正常</label>
								<input name="radio11" type="radio" value="正常" class="radioBtn" checked>
							</div>
							<div class="mui-radio mui-pull-left mui-left">
								<label>异常</label>
								<input name="radio11" type="radio" value="异常" class="radioBtn">
							</div>
						</div>
					</li>
					<li id="radio11InputDiv" class="mui-table-view-cell displayNone" style="background-color: #fff;">
						<span class="labelTitle">备注</span>
						<div class="mui-input-row" style="display: inline;float: right;">
							<input type="text" class="mui-input-clear" placeholder="异常情况说明及处理结果（选填）" style="margin-bottom: 0px;" />
						</div>
					</li>
				</ul>

				<ul class="mui-margin-vertical-sm mui-table-view" style="margin: 0rem!important">
					<li class="mui-table-view-cell" style="background-color: #fff;">
						<span id="radio12Title" class="labelTitle">流量计数据核对</span>
						<div class="mui-input-row" style="display: inline;float: right;">
							<div class=" mui-radio mui-pull-left mui-left">
								<label>正常</label>
								<input name="radio12" type="radio" value="正常" class="radioBtn" checked>
							</div>
							<div class="mui-radio mui-pull-left mui-left">
								<label>异常</label>
								<input name="radio12" type="radio" value="异常" class="radioBtn">
							</div>
						</div>
					</li>
					<li id="radio12InputDiv" class="mui-table-view-cell displayNone" style="background-color: #fff;">
						<span class="labelTitle">备注</span>
						<div class="mui-input-row" style="display: inline;float: right;">
							<input type="text" class="mui-input-clear" placeholder="异常情况说明及处理结果（选填）" style="margin-bottom: 0px;" />
						</div>
					</li>
				</ul>

				<ul class="mui-margin-vertical-sm mui-table-view" style="margin: 0rem!important">
					<li class="mui-table-view-cell" style="background-color: #fff;padding-right:0px">
						<span id="radio13Title" class="labelTitle">通讯信号检查</span>
						<div class="mui-input-row" style="display: inline;float: right;">
							<div class=" mui-radio mui-pull-left mui-left">
								<label>正常</label>
								<input name="radio13" type="radio" value="正常" class="radioBtn" checked>
							</div>
							<div class="mui-radio mui-pull-left mui-left">
								<label>未完成</label>
								<input name="radio13" type="radio" value="未完成" class="radioBtn">
							</div>
						</div>
					</li>
					<li id="radio13InputDiv" class="mui-table-view-cell displayNone" style="background-color: #fff;">
						<span class="labelTitle">备注</span>
						<div class="mui-input-row" style="display: inline;float: right;">
							<input type="text" class="mui-input-clear" placeholder="异常情况说明及处理结果（选填）" style="margin-bottom: 0px;" />
						</div>
					</li>
				</ul>
				<ul class="mui-margin-vertical-sm mui-table-view" style="margin: 0rem!important">
					<li class="mui-table-view-cell" style="background-color: #fff;">
						<span id="radio14Title" class="labelTitle">电子元器件及清洁</span>
						<div class="mui-input-row" style="display: inline;float: right;">
							<div class=" mui-radio mui-pull-left mui-left">
								<label>正常</label>
								<input name="radio14" type="radio" value="正常" class="radioBtn" checked>
							</div>
							<div class="mui-radio mui-pull-left mui-left">
								<label>异常</label>
								<input name="radio14" type="radio" value="异常" class="radioBtn">
							</div>
						</div>
					</li>
					<li id="radio14InputDiv" class="mui-table-view-cell displayNone" style="background-color: #fff;">
						<span class="labelTitle">备注</span>
						<div class="mui-input-row" style="display: inline;float: right;">
							<input type="text" class="mui-input-clear" placeholder="异常情况说明及处理结果（选填）" style="margin-bottom: 0px;" />
						</div>
					</li>
				</ul>
				<ul class="mui-margin-vertical-sm mui-table-view" style="margin: 0rem!important">
					<li class="mui-table-view-cell" style="background-color: #fff;padding-right:0px">
						<span id="radio15Title" class="labelTitle">电源、避雷检查</span>
						<div class="mui-input-row" style="display: inline;float: right;">
							<div class=" mui-radio mui-pull-left mui-left">
								<label>正常</label>
								<input name="radio15" type="radio" value="正常" class="radioBtn" checked>
							</div>
							<div class="mui-radio mui-pull-left mui-left">
								<label>未完成</label>
								<input name="radio15" type="radio" value="未完成" class="radioBtn">
							</div>
						</div>
					</li>
					<li id="radio15InputDiv" class="mui-table-view-cell displayNone" style="background-color: #fff;">
						<span class="labelTitle">备注</span>
						<div class="mui-input-row" style="display: inline;float: right;">
							<input type="text" class="mui-input-clear" placeholder="异常情况说明及处理结果（选填）" style="margin-bottom: 0px;" />
						</div>
					</li>
				</ul>
				<ul class="mui-margin-vertical-sm mui-table-view" style="margin: 0rem!important">
					<li class="mui-table-view-cell" style="background-color: #fff;">
						<span id="radio16Title" class="labelTitle">接地测试</span>
						<div class="mui-input-row" style="display: inline;float: right;">
							<div class=" mui-radio mui-pull-left mui-left">
								<label>正常</label>
								<input name="radio16" type="radio" value="正常" class="radioBtn" checked>
							</div>
							<div class="mui-radio mui-pull-left mui-left">
								<label>异常</label>
								<input name="radio16" type="radio" value="异常" class="radioBtn">
							</div>
						</div>
					</li>
					<li id="radio16InputDiv" class="mui-table-view-cell displayNone" style="background-color: #fff;">
						<span class="labelTitle">备注</span>
						<div class="mui-input-row" style="display: inline;float: right;">
							<input type="text" class="mui-input-clear" placeholder="异常情况说明及处理结果（选填）" style="margin-bottom: 0px;" />
						</div>
					</li>
				</ul>

				<ul class="mui-margin-vertical-sm mui-table-view" style="margin: 0rem!important">
					<li class="mui-table-view-cell" style="background-color: #fff;">
						<span id="radio17Title" class="labelTitle">后台数据核对</span>
						<div class="mui-input-row" style="display: inline;float: right;">
							<div class=" mui-radio mui-pull-left mui-left">
								<label>正常</label>
								<input name="radio17" type="radio" value="正常" class="radioBtn" checked>
							</div>
							<div class="mui-radio mui-pull-left mui-left">
								<label>异常</label>
								<input name="radio17" type="radio" value="异常" class="radioBtn">
							</div>
						</div>
					</li>
					<li id="radio17InputDiv" class="mui-table-view-cell displayNone" style="background-color: #fff;">
						<span class="labelTitle">备注</span>
						<div class="mui-input-row" style="display: inline;float: right;">
							<input type="text" class="mui-input-clear" placeholder="异常情况说明及处理结果（选填）" style="margin-bottom: 0px;" />
						</div>
					</li>
				</ul>
				<ul class="mui-margin-vertical-sm mui-table-view" style="margin: 0rem!important">
					<li class="mui-table-view-cell" style="background-color: #fff;">
						<span id="radio18Title" class="labelTitle">PLC程序备份</span>
						<div class="mui-input-row" style="display: inline;float: right;">
							<div class=" mui-radio mui-pull-left mui-left">
								<label>正常</label>
								<input name="radio18" type="radio" value="正常" class="radioBtn" checked>
							</div>
							<div class="mui-radio mui-pull-left mui-left">
								<label>异常</label>
								<input name="radio18" type="radio" value="异常" class="radioBtn">
							</div>
						</div>
					</li>
					<li id="radio18InputDiv" class="mui-table-view-cell displayNone" style="background-color: #fff;">
						<span class="labelTitle">备注</span>
						<div class="mui-input-row" style="display: inline;float: right;">
							<input type="text" class="mui-input-clear" placeholder="异常情况说明及处理结果（选填）" style="margin-bottom: 0px;" />
						</div>
					</li>
				</ul>

				<ul class="mui-margin-vertical-sm mui-table-view" style="margin: 0rem!important">
					<li class="mui-table-view-cell" style="background-color: #fff;">
						<span id="radio19Title" class="labelTitle">防水接线处理检查</span>
						<div class="mui-input-row" style="display: inline;float: right;">
							<div class=" mui-radio mui-pull-left mui-left">
								<label>正常</label>
								<input name="radio19" type="radio" value="正常" class="radioBtn" checked>
							</div>
							<div class="mui-radio mui-pull-left mui-left">
								<label>异常</label>
								<input name="radio19" type="radio" value="异常" class="radioBtn">
							</div>
						</div>
					</li>
					<li id="radio19InputDiv" class="mui-table-view-cell displayNone" style="background-color: #fff;">
						<span class="labelTitle">备注</span>
						<div class="mui-input-row" style="display: inline;float: right;">
							<input type="text" class="mui-input-clear" placeholder="异常情况说明及处理结果（选填）" style="margin-bottom: 0px;" />
						</div>
					</li>
				</ul>
				<ul class="mui-margin-vertical-sm mui-table-view" style="margin: 0rem!important">
					<li class="mui-table-view-cell" style="background-color: #fff;padding-right:0px">
						<span id="radio20Title" class="labelTitle">锂电池更换</span>
						<div class="mui-input-row" style="display: inline;float: right;">
							<div class=" mui-radio mui-pull-left mui-left">
								<label>更换</label>
								<input name="radio20" type="radio" value="更换" class="radioBtn" checked>
							</div>
							<div class="mui-radio mui-pull-left mui-left">
								<label>没更换</label>
								<input name="radio20" type="radio" value="没更换" class="radioBtn">
							</div>
						</div>
					</li>
					<li id="radio20InputDiv" class="mui-table-view-cell displayNone" style="background-color: #fff;">
						<span class="labelTitle">备注</span>
						<div class="mui-input-row" style="display: inline;float: right;">
							<input type="text" class="mui-input-clear" placeholder="异常情况说明及处理结果（选填）" style="margin-bottom: 0px;" />
						</div>
					</li>
				</ul>

			</div>

			<div class="mui-margin-vertical-sm">
				<div class="mui-inline mui-padding-horizontal-xs">上传图片(总大小10M以下，最多8张)</div>
				<div id='image-list' class="row image-list"></div>
			</div>

			<ul class="mui-margin-vertical-sm mui-table-view" style="margin: 0rem!important">
				<li class="mui-table-view-cell" style="background-color: #fff;padding: 11px 15px;">
					<span class="word">上传原图</span>
					<div class="mui-switch mui-switch-blue  mui-switch-mini" id="high_img">
						<div class="mui-switch-handle"></div>
					</div>
				</li>
			</ul>

			<div class="mui-margin-vertical-sm">
				<div class="mui-inline mui-padding-horizontal-xs">综合内容</div>
				<div class="row mui-input-row">
					<textarea id='content' name="content" class="mui-input-clear content" placeholder="综合巡查信息（选填）"></textarea>
				</div>
			</div>

			<ul class="mui-margin-vertical-sm mui-table-view" style="margin: 0rem!important">
				<li class="mui-table-view-cell" style="background-color: #fff;">
					<span class="labelTitle">巡查人员</span>
					<div class="mui-input-row" style="display: inline;float: right;">
						<input id="patrolPersonInput" type="text" class="mui-input-clear" placeholder="多个人员用分号隔开" style="margin-bottom: 0px;" />
					</div>
				</li>
			</ul>

			<div class="title" style="width:100%; height:45px;line-height: 45px;font-size: 18px;margin-top:10px;clear:both;color:white;">
				<div id="submit" style="width:100%; height:100%;float: left;text-align:center;background-color:#179efa;font-family: " Microsoft YaHei ";">上报信息</div>
			</div>

			<!--<div class="mui-margin-vertical mui-padding-horizontal">
				<div class="mui-row">
					<button class="mui-btn mui-btn-block " style="background-color:#179efa;color: white;" id="submit">上报信息</button>
				</div>
			</div>-->

			<script src="../lib/mui/mui.min.js"></script>
			<!--			<script src="../js/app.js"></script>
-->
			<script src="../js/serviceUrlConfig.js" type="text/javascript"></script>
			<script src="../js/winVisibleControl.js" type="text/javascript"></script>

			<script type="text/javascript">
				var feature, userInfo, locationInfo, lastPatrolValue;
				(function($, doc) {
					//最多上传图片
					var IMG_MAX_NUM = 8;
					//录音最短时间
					var MIN_SOUND_TIME = 800;
					//最大上传字节
					var MAX_UPLOAD_SIZE = 1 * 1024;
					var picType = '2';
					$.init({
						gestureConfig: {
							tap: true, //默认为true
							doubletap: true, //默认为false
							longtap: true, //默认为false
							swipe: true, //默认为true
							drag: true, //默认为true
							hold: true, //默认为false，不监听
							release: true //默认为false，不监听
						}
					});

					//question对象保存表单提交的数据包括图片文件
					var question = {
						strPatrol: '',
						strPatrolDetail: '',
						files: [], //上传图片地址,数组
						//添加图片
						addFile: function(path) {
							this.files.push(path);
						},
						//删除图片
						removeFile: function(index) {
							this.files.splice(index, 1); //删除图片数组元素
						},
						//替换图片
						exFile: function(index, path) {
							this.files.splice(index, 1, path);
						}
					};

					mui.plusReady(function() {
						plus.navigator.setStatusBarStyle('dark');
						var self = plus.webview.currentWebview();
						document.getElementById("headtitle").innerHTML = self.title;
						//需要两个信息 一个是 用户信息 另一个是当前取水井信息  还有定位信息
						feature = self.param.feature;
						userInfo = self.param.userInfo;
						locationInfo = self.param.locationInfo;
						lastPatrolValue = self.param.lastPatrolValue;
						console.log(JSON.stringify(userInfo))

						// todo 通过feature对 字段进行赋值
						configByFeature(feature, lastPatrolValue,userInfo);

						// todo 获取水表类型
						if(picType == '1') {
							document.getElementById("downTypeDiv").classList.add('displayNone');
							document.getElementById("upTypeDiv").classList.remove('displayNone');
						} else {
							document.getElementById("downTypeDiv").classList.remove('displayNone');
							document.getElementById("upTypeDiv").classList.add('displayNone');
						}

						setTimeout(function() {
							//							init_title();
							//							init_money();
						}, 300)
						//document.getElementById("upload_box").style.display="block";
						init_image_add(); //初始化图片添加器

						//重写back，返回前询问用户
						var oldBack = mui.back;
						mui.back = function(e) {
							mui.confirm("尚未提交，是否返回？", "确认返回", ['是', '否'], function(e) {
								if(e.index == 0)
									oldBack();
							})
						}
					});

					//					$('input:radio').addEventListener("tap", function() {
					//						console.log('tap')
					//					});

					$(document).on('tap', '.radioBtn', function() {
						if(this.value == '正常' || this.value == '更换') {
							//$('#'+this.name + 'InputDiv').addClass('displayNone')
							document.getElementById(this.name + 'InputDiv').classList.add('displayNone');
						} else {
							//$('#'+this.name + 'InputDiv').removeClass('displayNone')
							document.getElementById(this.name + 'InputDiv').classList.remove('displayNone');
						}
					})

					//radio判断选中
					var ele1 = document.getElementsByName('radio1');
					for(var i = 0; i < ele1.length; i++) {
						console.log(ele1[i].value + ":" + ele1[i].checked)
					}

					//提交需求
					document.getElementById("submit").addEventListener("tap", function() {
						//获取表单数据
						var patrolContent = document.getElementById("content").value;
						var patrolObject = {};
						patrolObject.userid = userInfo.id;
						patrolObject.content = patrolContent;
						patrolObject.posx = locationInfo.currentLon;
						patrolObject.posy = locationInfo.currentLat;
						patrolObject.sbbh = (feature.properties.水表编号 || feature.properties.sbbh);
						patrolObject.electricType = getCheckBoxRes('radio2')[0];
						patrolObject.equipmentType = getCheckBoxRes('radio1')[0];
						patrolObject.sceneNowValue = document.getElementById('sceneNowValueInput').value;
						patrolObject.sceneTotalValue = document.getElementById('sceneTotalValueInput').value;
						patrolObject.patrolPerson = document.getElementById('patrolPersonInput').value;
						// 2 patrol 增加  sceneNowVaule sceneTotalValue backNowValue backTotalValue ElectricType EquipmentType

						question.strPatrol = JSON.stringify(patrolObject);
						// Todo 1 新增 strPatrolDetail 
						// 2 patrol 增加  sceneNowVaule sceneTotalValue backNowValue backTotalValue ElectricType EquipmentType
						// strPatrolDetail string转成的array

						var patrolDetailArray = [];
						// 如果为type1 循环获取值 3-10为 type1
						if(picType == '1') {
							for(var i = 3; i < 11; i++) {
								var patrolDetailObj = {}
								patrolDetailObj.patrolType = '1';
								patrolDetailObj.patrolContent = document.getElementById('radio' + i + 'Title').innerText;
								patrolDetailObj.patrolStatus = getCheckBoxRes('radio' + i)[0];
								patrolDetailObj.patrolRemark = mui('#radio' + i + 'InputDiv input')[0].value;
								patrolDetailArray.push(patrolDetailObj);
							}

						} else {
							for(var i = 11; i < 21; i++) {
								var patrolDetailObj = {}
								patrolDetailObj.patrolType = '2';
								patrolDetailObj.patrolContent = document.getElementById('radio' + i + 'Title').innerText;
								patrolDetailObj.patrolStatus = getCheckBoxRes('radio' + i)[0];
								patrolDetailObj.patrolRemark = mui('#radio' + i + 'InputDiv input')[0].value;
								patrolDetailArray.push(patrolDetailObj);
							}
						}
						console.log(JSON.stringify(patrolDetailArray));
						question.strPatrolDetail = JSON.stringify(patrolDetailArray);

						console.log(JSON.stringify(patrolObject));
						if(plus.networkinfo.getCurrentType() == plus.networkinfo.CONNECTION_NONE)
							return mui.toast("连接网络失败，请稍后再试");
						if(!locationInfo.currentLon)
							return mui.toast("未能获取定位信息，请稍后再试！");
						if(trim(patrolContent).length > 150)
							return mui.toast("内容过长，长度不超过150字！");

						//确认支付
						mui.confirm("上传后将无法修改，是否上传？", "确认上传", ["是", "否"], function(e) {
							if(e.index == 0) {
								//用户未选择上传原图时，压缩所有上传图片
								if(!document.getElementById("high_img").classList.contains("mui-active") && question.files.length > 0) {
									submitQuesZipImg(question.files.length - 1);
								} else {
									submitQues();
								}
							} else {
								return false;
							}
						})

					}, false);

					function configByFeature(feature, lastPatrolValue,userInfo) {
						// 对水表
						document.getElementById("picSbbh").innerText = (feature.properties.水表编号 || feature.properties.sbbh);
						document.getElementById("picQsdz").innerText = (feature.properties.取水地址 || feature.properties.qsdz);
						//从feature中获取？
//						document.getElementById("backNowValueInput").innerText = lastPatrolValue.backNowValue;
//						document.getElementById("backTotalValueInput").innerText = lastPatrolValue.backTotalValue;
						document.getElementById("patrolPersonInput").value=userInfo.username;
						setCheckBoxState('radio1', lastPatrolValue.equipmentType);
						setCheckBoxState('radio2', lastPatrolValue.electricType)
					}

					//获取radio的值 可返回多选
					function getCheckBoxRes(name) {
						var rdsObj = document.getElementsByName(name);
						var checkVal = new Array();
						var k = 0;
						for(i = 0; i < rdsObj.length; i++) {
							if(rdsObj[i].checked) {
								checkVal[k] = rdsObj[i].value;
								k++;
							}
						}
						return checkVal;
					}

					//给radio赋值
					function setCheckBoxState(name, value) {
						var rdsObj = document.getElementsByName(name);
						var checkVal = new Array();
						var k = 0;
						for(i = 0; i < rdsObj.length; i++) {
							if(rdsObj[i].value == value) {
								rdsObj[i].checked = true;
							} else {
								rdsObj[i].checked = false;
							}
						}

					}

					//压缩图片并且上传表单数据
					function submitQuesZipImg(len) {
						//第一次
						if(len == question.files.length - 1)
							plus.nativeUI.showWaiting("正在压缩图片...", {
								back: "none"
							});

						//当图片压缩完后，结束递归
						if(!question.files[len]) {
							plus.nativeUI.closeWaiting();
							return submitQues();
						}

						var url = question.files[len];
						plus.zip.compressImage({
							src: url,
							dst: '_doc/zip_' + url.substr(url.lastIndexOf('/') + 1),
							overwrite: true,
							quality: 50,
							width: "60%",
						}, function(zip) {
							//压缩成功，替换原图路径
							question.files[len] = zip.target;
							submitQuesZipImg(--len);
						}, function(e) {
							//压缩失败
							mui.toast('压缩失败！');
							plus.nativeUI.closeWaiting();
						});
					}

					//上传表单数据和文件
					function submitQues() {
						var timer = null;
						var progress = mui("#upload_progress").progressbar();
						//建立连接
						//						var url = HTTP_DOMAIN + "Ques/addQues";
						//												var url = "http://120.27.217.171:8080/lgApp/UploadServlet";
						var url = getServletUrl("UploadServlet");
						//var url = "http://192.168.5.104:8080/lgAPP/UploadServlet";
						//新建上传任务
						var uploader = plus.uploader.createUpload(url, {
							method: 'POST'
						}, function(upload, status) {
							//注意：转交给addevent处理去了，但必须传入此函数作为createupload参数，否则产生错误
						});

						//内部函数：结束下载后的操作，上传成功，失败，还有中途停止都后都使用该函数
						var afterUpload = function() {
							plus.nativeUI.closeWaiting(); //关闭等待窗
							clearInterval(timer); //关闭监听
						}
						//内部函数：开始下载后的操作
						var doUpload = function(upload) {
							//显示进度条
							document.getElementById("upload_progress").style.display = "block";
							//显示等待禁止返回按钮
							plus.nativeUI.showWaiting("正在提交信息，上传图片...", {
								back: "none"
							});
							//启动进度条监听
							timer = setInterval(function() {
								/*
								 * 文件过大，停止上传，无效
								 * 黄有为 devilyouwei@gmail.com 2017-8-12
								 * 由于html5+的upload对象存在不可取消上传的bug，故而暂时注释掉，以后可开启
								if(upload.totalSize > MAX_UPLOAD_SIZE) {
									mui.alert("文件上传过大，请关闭上传原图或删减！","上传超出","好的",null,"div");
									upload.abort(); //停止上传
									plus.uploader.clear(); //清楚上传任务
									afterUpload();
								}
								*/
								//进度条%
								var percent = parseInt((upload.uploadedSize / upload.totalSize) * 100);
								if(!isNaN(percent))
									progress.setProgress(percent);
							}, 100)
						};

						//添加上传数据
						for(key in question) {
							//去掉此三项为文件
							if(key == "files")
								continue;
							uploader.addData(key, question[key].toString());
						}

						//添加八图上传
						for(var i = 0; i < question.files.length; i++) {
							uploader.addFile(question.files[i], {
								key: "img" + i
							});
						}

						//监听上传状态
						uploader.addEventListener("statechanged", function(upload, status) {
							switch(upload.state) {
								case 1: // 开始
									doUpload(upload); //一定要有对应的afterUpload
									break;
								case 4:
									//上传完成
									afterUpload(); //结束上传中UI
									progress.setProgress(100);

									//									mui.alert("巡查信息提交成功", "提交成功", "确定返回", function() {
									//										plus.webview.currentWebview().close();
									//										//刷新主页需求
									//										//mui.fire(plus.webview.getWebviewById("index"), "updateQues");
									//									}, "div");

									var res = JSON.parse(upload.responseText); //服务器返回数据转换为json解析
									if(res.type == 1) {

										//提交成功后再提交一次表单
										//excel表

										mui.alert("巡查信息提交成功", "提交成功", "确定返回", function() {
											//plus.webview.currentWebview().close();
											//刷新主页需求
											mui.fire(plus.webview.getWebviewById("pictureHistory"), 'refresh');
											//											var id = "../html/pictureHistory.html";
											//											var href = "../html/pictureHistory.html";
											//											var title = "巡查信息";
											//											// 带上用户信息
											//											openNewWindow(id, href, title, {
											//												feature: feature,
											//												userInfo: userInfo,
											//												locationInfo: locationInfo
											//											});
										}, "div");
									} else {
										mui.alert(res.info);
									}

									break;
								default:
									break;
							}
						});
						//开始上传任务
						uploader.start();

					}

					//取得当前节点在平行兄弟节点的位置是第几个
					function getChildrenIndex(ele) {
						var i = 0;
						while(ele = ele.previousElementSibling) {
							i++;
						}
						return i;
					}

					var imageList = document.getElementById('image-list');
					//初始化图片添加器
					function init_image_add() {
						//上传图片上限,超过不现实加号
						if(question.files.length >= IMG_MAX_NUM)
							return;
						var placeholder = document.createElement('div');
						placeholder.setAttribute('class', 'image-item space');

						//删除图片
						var closeButton = document.createElement('div');
						closeButton.setAttribute('class', 'image-close');
						closeButton.innerHTML = 'X';
						//小X的点击事件
						closeButton.addEventListener('tap', function(event) {
							question.removeFile(getChildrenIndex(placeholder)); //删除实际图片数组元素，先删除数组中的
							imageList.removeChild(placeholder); //删除ui，必须后删除，否则节点会找不到了
							if(question.files.length >= IMG_MAX_NUM - 1)
								init_image_add();
							event.stopPropagation();
						}, false);

						placeholder.addEventListener('tap', function(event) {
							var btnArray = [{
								title: "相册"
							}, {
								title: "拍照"
							}];

							//actionsheet
							plus.nativeUI.actionSheet({
								title: "选择图片",
								cancel: "取消",
								buttons: btnArray
							}, function(e) {
								var i = e.index;
								switch(i) {
									case 0:
										break;
									case 1:
										plus.gallery.pick(function(e) {
											plus.io.resolveLocalFileSystemURL(e, function(entry) {
												var url = entry.toLocalURL();
												var name = url.substr(e.lastIndexOf('/') + 1);

												//压缩取得缩略图
												plus.zip.compressImage({
													src: url,
													dst: '_doc/' + name,
													overwrite: true,
													quality: 50,
													height: '300px',
													clip: {
														top: "25%",
														left: "25%",
														width: "300px",
														height: "300px"
													}
												}, function(zip) {
													placeholder.style.backgroundImage = "url('" + zip.target + "')";
													if(!placeholder.classList.contains('space')) { //已有图片
														question.exFile(getChildrenIndex(placeholder), url);
													} else { //加号
														placeholder.classList.remove('space');
														question.addFile(url);
														init_image_add();
													}
												}, function(zip) {
													mui.toast('压缩失败！');
												});

											}, function(e) {
												console.log("读取相册文件错误：" + e.message);
											});

										}, function(e) {
											console.log(e.message);
										}, {});
										break;
									case 2:
										plus.camera.getCamera().captureImage(function(e) {
											plus.io.resolveLocalFileSystemURL(e, function(entry) {
												var url = entry.toLocalURL();
												var name = url.substr(e.lastIndexOf('/') + 1);

												//压缩
												plus.zip.compressImage({
													src: url,
													dst: '_doc/' + name,
													overwrite: true,
													quality: 50,
													height: '300px',
													clip: {
														top: "25%",
														left: "25%",
														width: "300px",
														height: "300px"
													}
												}, function(zip) {
													placeholder.style.backgroundImage = "url('" + zip.target + "')";
													if(!placeholder.classList.contains('space')) { //已有图片
														question.exFile(getChildrenIndex(placeholder), url);
													} else { //加号
														placeholder.classList.remove('space');
														question.addFile(url);
														init_image_add();
													}
												}, function(zip) {
													mui.toast('压缩失败！');
												});
											}, function(e) {
												console.log("读取拍照文件错误：" + e.message);
											});
										}, function(s) {
											console.log("error" + s);
										}, {});
										break;
								}
							});

						}, false);
						/*
						 * <div class="image-item space" id="img1">
						 * 		<div class="image-close">x</div>
						 * </div>
						 */
						placeholder.appendChild(closeButton);
						imageList.appendChild(placeholder);
					};

					function trim(str) {
						return str.replace(/(^\s*)|(\s*$)/g, "");
					}

				})(mui, document);
			</script>
	</body>

</html>